<template>
  <PageContainer>
    <KeepAlive>
      <JobTable v-if="currentCard === jobTableCard" @show-job-sharding-table="showJobShardingTable"></JobTable>
    </KeepAlive>
    <JobShardingTable
      v-if="currentCard === jobShardingTableCard"
      :name="currentJobName"
      @show-job-table="showJobTable"
    ></JobShardingTable>
  </PageContainer>
</template>

<script setup lang="ts">
import { PageContainer as PageContainer } from '@ant-design-vue/pro-layout';
import JobTable from '@/views/job/JobTable.vue';
import JobShardingTable from '@/views/job/JobShardingTable.vue';

//作业列表页面
const jobTableCard = 'jobTableCard';
//作业分片列表页面
const jobShardingTableCard = 'jobShardingTableCard';

//当前页面
let currentCard = ref(jobTableCard);

function showJobTable() {
  currentCard.value = jobTableCard;
}

//作业分片列表页面
let currentJobName = ref('');

function showJobShardingTable(jobName: string) {
  currentJobName.value = jobName;
  currentCard.value = jobShardingTableCard;
}
</script>

<style lang="less" scoped></style>
